<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }

        body{
            background-color: #000;
        }

        #box{
            width: 100px;
            height: 100px;
            background-color: red;

            position: absolute;
            /*opacity: 0.5;
            filter: alpha(Opacity=50);*/
        }
    </style>
</head>
<body>
   <button id="btn">往右走</button>
   <button id="btn1">往左走</button>
   <div id="box"></div>
<script src="js/myFunc.js"></script>
<script>
    window.onload = function () {

        // 0. 变量
        var box = $("box");

        // 1. 监听按钮的点击
        $("btn").onclick = function () {
            buffer(box, {"opacity": 0.4, "left": 400, "top": 400, "width": 250, "height": 300}, function () {
                buffer(box, {"left": 100, "top": 100, "width": 50, "height": 200, "opacity": 1});
            });
        };

        $("btn1").onclick = function () {
            buffer(box, {"left": 100, "top": 100, "width": 50, "height": 200});
        };
    };


</script>
</body>
</html>